<link rel="stylesheet" href="../css/content.css" type="text/css" />
<script type="text/javascript" src="../js/change_info.js"></script>

<script type='text/javascript' >
Ext.onReady(function(){
	$("#change").click(function(){
		var old_email = $("#old_email").val();
		var confirm_email = $("#confirm_email").val();
		var new_email = $("#new_email").val();
		if(old_email != confirm_email){
			$("#old_email").attr('value','');
			$("#confirm_email").attr('value','');
			$("#new_email").attr('value','');
			alert("Wrong email");
		}else{
			if (new_email == "") {
				alert("Please input new email !")
			}else{
				info.change_email(old_email,new_email);
			}			
		}
		
	});
	$("#cancel").click(function(){
		window.location = "?act=info";
	});
});
</script>
<div id="wrapper">
	<div id = "change_email" style="padding:50px;">
		<h1 >Change email</h1>
		<div id = ""  style="padding:20px;">
		<table width="400px" cellspacing="1" cellpadding="5" border="0" align="center" class="table-form">
			<tbody>
				<tr>
					<td class='label' width='100px'>■Old&nbsp;email<span style="color: red;">*</span></td>
					<td class='control'width='300px'><input style='width:300px;' id='old_email' type='text'/></td>
				</tr>
				<tr>
					<td class='label' width='100px'>■Confirm&nbsp;email<span style="color: red;">*</span></td>
					<td class='control'width='300px'><input style='width:300px;' id='confirm_email' type='text'/></td>
				</tr>
				<tr>
					<td class='label' width='100px'>■New&nbsp;email<span style="color: red;">*</span></td>
					<td class='control'width='300px'><input style='width:300px;' id='new_email' type='text'/></td>
				</tr>
				<tr>
					<td align="center" colspan="2" style="text-align: center;" class="label">
						  <input type="button" style="width: 125px;" id="change" value="Change">
         				  <input type="button" style="width: 125px;" id="cancel" value="Cancel">
					</td>
				</tr>
			</tbody>
		</table>
		</div>
	</div>
</div>